資料產品 Charts (策略)
舊方案分析
專案背景“食品卡車”在舊金山和庫比蒂諾銷售國際薄餅店資料應用。
/Untitled.png)
/Untitled 1.png)
專案之前的版本:產品的框架包含選單與每日的銷售資料兩部分,應用可以有效的跟蹤銷售資料,但我們可以幫他設計的更有用
/Untitled 2.png)
新方案
專案目標:提高使用者(企業)的運營效率。
改進方向:將產品選代成使用者可以採取具體行動並可獲得交易決策
需求分析:對於企業有用的關鍵資訊
1檢視近日銷售資料
2哪款產品最受歡迎
3每日最佳銷售時段或地點
設計思路:當我們設計多個圖表時需要根據目標確定資訊權重。
1 描述需要體現圖表的內容和關鍵資訊
2資料的細節能使圖表更加生動且有深度
3在互動中使用漸進式來展示圖表的複雜性
/Untitled 3.png)
基礎框架:包含下訂單和看銷量兩個模組。新方案延續了原有的使用者習慣
在第二個tab下,將每日銷售列表收進到了一個入口中,這樣在結構上就留出足夠的空間用來承載圖表控制元件,確保使用者對原有銷量資料的掃描和點選獲取
/Untitled 4.png)
頂部加入了靜態圖表模組
/Untitled 5.png)
點選靜態圖表展開互動圖表,如總結類的資料:月周銷量、雙休日銷量、最高單日銷量
/Untitled 6.png)
構建另外兩個核心圖表模組(圖表系統)1 使用熟悉的圖表 2 圖表之間有差異化
/Untitled 7.png)
構建另外兩個核心圖表模組(圖表系統)
/Untitled 8.png)
新增一個顯示“最受歡迎薄餅”的圖表,比較每種薄餅的相對銷售水平是方法之一
/Untitled 9.png)
過去30天的資料,僅需一根柱形圖來比較款式的受歡迎程度,將柱形圖分開,可以更清楚地比較它們的大小。
/Untitled 10.png)
將柱形圖分開,可以更清楚地比較它們的大小,但豎著擺放更像一個時間序列圖
/Untitled 11.png)
水平排布可以突出這個圖表與最近銷售圖表的差異
/Untitled 12.png)
水平排布可以使柱形圖更長,且不需要更高的空間
/Untitled 13.png)
在這個預覽中省略了多餘的資料標籤,這樣讓使用者聚焦看頂部的資訊(漸進原理)
/Untitled 14.png)
對於最終圖表,需展示食品車運營的兩個城市中,每週的每天的銷售情況
/Untitled 15.png)
以上是過去30天每週每天的平均日銷售額
/Untitled 16.png)
需要將這些柱形圖分開以代表不同的城市資料
/Untitled 17.png)
最後將柱形圖轉換為折線圖,以便關注每天的變化
/Untitled 18.png)
將此圖表新增到銷售資料頁面,外加描述來總結資料
/Untitled 19.png)
這樣可以看到過去30天中最好的銷售日是San Francisco的星期日,最後講一下這個模組的詳情頁
/Untitled 20.png)
詳情頁設計了更多的互動和細節,包括兩條線的關鍵資料,這樣就完成了圖表系統的設計,最終的方案可以顯示最近的銷售情況。
/Untitled 21.png)
熱銷商品以及銷量最好的日期和地點。產品的實用性也得到了極大的提升了!
/Untitled 22.png)